<script setup lang="ts">
import { StageObject, AnimateComObject, AnimateTransformObject, AnimateMotionObject } from '@/objects/StageObject';

defineProps<{
    data: StageObject[]
}>()
</script>
<template>
    <template v-for="eo of data">
        <animate v-if="eo instanceof AnimateComObject && eo.attributeName !== 'transform'"
            :attributeName="eo.getattributeName()" :values="eo.values" :keyTimes="eo.keyTimes" :dur="eo.duration + 's'"
            :repeatCount="eo.repeatCount" />
        
        <animateTransform v-else-if="(eo instanceof AnimateTransformObject)" attributeName="transform"
            attributeType="XML" :type="eo.transformType.value" :from="eo.fromValue" :to="eo.toValue"
            :dur="eo.duration + 's'" :repeatCount="eo.repeatCount"/>

        <animateMotion v-else-if="(eo instanceof AnimateMotionObject)" :dur="eo.duration + 's'"
            :repeatCount="eo.repeatCount">
            <mpath :href="'#' + eo.mpath.value" />
        </animateMotion>
        <animateTransform v-else-if="(eo instanceof AnimateComObject) && eo.attributeName === 'transform'" attributeName="transform" :type="eo.subtype"
            :dur="eo.duration + 's'" :repeatCount="eo.repeatCount" :values="eo.values" :keyTimes="eo.keyTimes" />
    </template>
</template>